<!--新增复印用途模板-->
<script setup>

//面包屑
import {onMounted, ref} from "vue";
import qs from "qs";
import axios from "axios";
import {ElMessage} from "element-plus";
import router from "@/router";
import _ from 'lodash';

onMounted(()=>{
  let breadcrumbData=["病案复印管理","复印用途管理","新增模板"];
  localStorage.setItem('breadcrumb', JSON.stringify(breadcrumbData));
  getPurpose();
  loadContent();
  getQueryId();
  console.log(purposeFormOri);
})

//获取路由中的查询参数并且查询模板信息（如果存在）
const getQueryId=()=>{
  let query=router.currentRoute.value.query;
  console.log(query);
  if(Object.keys(query).length!=0){
    let data=qs.stringify({id:query.id});
    axios.get(getBaseURL(1)+'/v1/duplicate/copy_purpose/select?'+data).then((response)=>{
      purposeFormOri=response.data.data[0];
      purposeForm.value=_.cloneDeep(response.data.data[0]);
      console.log(purposeFormOri.value);
    })
    tips.value='修改模板成功！';
  }
  else{
    tips.value='新增模板成功！';
  }
}

//提示词
const tips=ref('');
//初始表单
let purposeFormOri={
  id:'',
  purposeId:'',
  status:'',
  recommend:[],
  info:'',
  createTime:'',
  createUser:''
}
//新增表单项
const purposeForm=ref({
  id:'',
  purposeId:'',
  status:'',
  recommend:[],
  info:'',
  createTime:'',
  createUser:''
});
//复印用途的选项
const purposeOption=ref([]);
//复印内容的转换数组
const contentOption=ref([]);
//拿一下复印内容
const loadContent=()=>{
  axios.get(getBaseURL(1)+'/v1/duplicate/copy_content/select').then((response)=>{
    contentOption.value=response.data.data;
  });
}

//获取复印用途
const getPurpose=()=>{
  let query=qs.stringify({dictType:'print_type'});
  axios.get(getBaseURL(4) + '/v1/medical/medicalSystem/selectDictDetail/?'+query).then((response)=>{
    if(response.data.code==2000){
      purposeOption.value=response.data.data;
    }
    else(ElMessage.error(response.data.msg));
  });
}
//保存复印用途模板
const updateTemplate=()=>{
  let data=qs.stringify(purposeForm.value);
  axios.post(getBaseURL(1)+'/v1/duplicate/copy_purpose/update',data).then((response)=>{
    if(response.data.code==2000){
      ElMessage.success(tips.value);
      router.push('/duplicate/copyingPurposes');
    }
  });
}
//重置修改，需要拷贝数据过去
const resetTemplate=()=>{
  let data=_.cloneDeep(purposeFormOri);
  console.log(data);
  purposeForm.value=data;
}

</script>

<template>
  <div style="background-color:#F0F2F5;height: 90%;position: relative;">
    <el-card style="background-color:#fff;width: 90%;margin: 0 auto;padding: 50px;" shadow="never">
      <el-form label-width="100px" label-position="left">
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="复印用途：">
              <el-select style="width: 400px;" default-first-option v-model="purposeForm.purposeId">
                <!--读表-->
                <el-option v-for="(item) in purposeOption" :label="item.dictLabel" :value="item.dictValue"/>
              </el-select>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="状态：">
              <el-radio-group v-model="purposeForm.status">
                <el-radio value="1">启用</el-radio>
                <el-radio value="0">禁用</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="复印内容：">
              <!--读表-->
              <el-checkbox-group v-model="purposeForm.recommend">
                <el-checkbox v-for="item in contentOption" :label="item.name" :value="item.id"/>
              </el-checkbox-group>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="24">
            <el-form-item label="备注：">
              <el-input type="textarea" show-word-limit maxlength="100" placeholder="请输入" rows="3" resize="none" v-model="purposeForm.info"/>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row :gutter="20">
          <el-col :span="8">
            <el-form-item label="">
              <el-button type="primary" @click="updateTemplate">保存</el-button>
              <el-button @click="resetTemplate">重置</el-button>
              <el-button @click="router.push('/duplicate/copyingPurposes')">返回</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-card>
  </div>
</template>

<style scoped>

</style>